//页面打开渲染数据
function moviesInfo() {
  Ajax({
    url: "http://localhost/project/server/movies.php",
    success(msg) {
      sessionStorage.setItem("moviesInfo", msg);
      msg = JSON.parse(msg);
      rendermoviesInfo(msg);
    },
  });
}
moviesInfo();

//封装渲染函数
function rendermoviesInfo(msg) {
  const tbody = document.getElementById("tbodys");
  tbody.innerHTML = "";
  msg.slice(0, 5).forEach((item) => {
    let str = `
        <tr>
        <td>${item.did}</td>
        <td><img src = ${item.img} style="width:50px"></td>
        <td>${item.mingc}</td>
        <td>${item.daoY}</td>
        <td>${item.zhuY}</td>
        <td>${item.pingF}</td>
        <td>${item.riQ}</td>
        <td>${item.dizhi}</td>
        <td>${item.leiX}</td>
        <td>
        <button class="btn btn-warning btn-sm" data-bs-toggle="modal" data-bs-target="#myModal" id='${item.did}' data-upd='upd'>修改</button>
        <button class="btn btn-danger btn-sm" id='${item.did}' data-del='del'>删除</button>
        </td>
      </tr>
          
    `;
    tbody.innerHTML += str;
  });
}

// 删除
$("#tbodys").click(function (e) {
  e = e || window.event;
  if (e.target.dataset.del == "del") {
    const flag = window.confirm("请确认删除");
    if (flag) {
      $.ajax({
        url: "http://localhost/project/server/movieDelete.php",
        data: { id: e.target.id },
        success() {
          location.reload();
        },
      });
    }
  }

  // 修改,先把数据渲染到模态框上
  if (e.target.dataset.upd == "upd")
    Ajax({
      url: "http://localhost/project/server/movieUpdatei.php",
      data: { id: e.target.id },
      // data: { did: did, img: userimg, mingC: mingC, daoY: daoY, zhuY: zhuY, pingF: pingF, riQ: riQ, dizhi: dizhi, leiX: leiX },
      success(msg) {
        msg = JSON.parse(msg)[0];
        document.querySelector("#url").value = msg.img;
        document.querySelector("#fname").value = msg.mingc;
        document.querySelector("#dy").value = msg.daoY;
        document.querySelector("#zy").value = msg.zhuY;
        document.querySelector("#pf").value = msg.pingF;
        document.querySelector("#time").value = msg.riQ;
        document.querySelector("#cd").value = msg.dizhi;
        document.querySelector("#lx").value = msg.leiX;

        // 渲染的影片
        document.querySelector("#updatesid").value = msg.did;
      },
    });
});

function ok() {
  const did = $("#did").val();
  const userimg = $("#img").val();
  const mingC = $("#mingC").val();
  const daoY = $("#daoY").val();
  const zhuY = $("#zhuY").val();
  const pingF = $("#pingF").val();
  const riQ = $("#riQ").val();
  const dizhi = $("#dizhi").val();
  const leiX = $("#leiX").val();

  if (
    !(did && userimg && mingC && daoY && zhuY && pingF && riQ && dizhi && leiX)
  ) {
    return alert("请输入完整的数据！");
  }
  $.ajax({
    type: "POST",
    url: "http://localhost/project/server/movieUpdatei.php",
    data: {
      did: did,
      img: userimg,
      mingC: mingC,
      daoY: daoY,
      zhuY: zhuY,
      pingF: pingF,
      riQ: riQ,
      dizhi: dizhi,
      leiX: leiX,
    },
    success(msg1) {
      location.reload();
    },
  });
}

// 首页
function index() {
  // sessStorage里面存储的pageCurrent = 1
  sessionStorage.setItem("pageCurrent", 1);
  // 从storage里面获取所有的学生数据,渲染前10条
  let moviesInfo = sessionStorage.getItem("moviesInfo");
  // 将JSON数据转换成对象
  moviesInfo = JSON.parse(moviesInfo);
  //获取前10条数据,准备渲染页面
  moviesInfo = moviesInfo.slice(0, 5);
  //调用函数,渲染页面
  rendermoviesInfo(moviesInfo);
}

//实现尾页
/* 
   1. 获取所有的学生数据
   2. 计算总共有多少页,将尾页存储到storage里面
   3. 获取后10条数据,准备渲染页面
*/
function last() {
  //解除首页的禁用
  // $("#first").css("cursor","auto")
  // $("#first").attr("disabled",false)

  //1. 获取所有的学生数据
  let moviesInfo = sessionStorage.getItem("moviesInfo");
  //2. 计算总共有多少页
  moviesInfo = JSON.parse(moviesInfo);
  const pageCurrent = Math.ceil(moviesInfo.length / 5);
  //3. 将总共的页存储到storage里面
  sessionStorage.setItem("pageCurrent", pageCurrent);
  //4. 获取后10条数据,准备渲染页面

  //将最后一页的数据计算出来
  if (moviesInfo.length % 5 != 0) {
    moviesInfo = moviesInfo.slice(
      Math.floor(moviesInfo.length / 5) * 5,
      moviesInfo.length
    );
  } else {
    moviesInfo = moviesInfo.slice(
      Math.floor(moviesInfo.length / 5 - 1) * 5,
      moviesInfo.length
    );
  }
  //渲染页面
  rendermoviesInfo(moviesInfo);
}

/* 
    上一页
        1. 获取当前页
        2. 当前页-1 不能小于1,如果小于,那么就等于1
        3. 获取当前页是数据
            slice(当前页*10,当前*10+10)
*/
function up() {
  // 1. 获取当前页
  let pageCurrent = +sessionStorage.getItem("pageCurrent");
  // 2. 当前页-1 不能小于1,如果小于,那么就等于1
  pageCurrent = pageCurrent - 1;
  if (pageCurrent < 1) {
    pageCurrent = 1;
    // $("#first").attr("disabled",true)
    // $("#first").css("cursor","not-allowed")
  } else {
    // $("#first").css("cursor","auto")
    // $("#first").attr("disabled",false)
  }
  //存储当前页
  sessionStorage.setItem("pageCurrent", pageCurrent);
  //获取上一页的数据
  let moviesInfo = sessionStorage.getItem("moviesInfo");
  //将JSON转换成对象
  moviesInfo = JSON.parse(moviesInfo);
  moviesInfo = moviesInfo.slice((pageCurrent - 1) * 5, pageCurrent * 5);
  console.log(moviesInfo);
  //渲染数据
  rendermoviesInfo(moviesInfo);
}

/* 
    下一页
        1. 获取当前页
        2. 当前页+1,当前页不能大于最后一页
        3. 获取当前页的数据
        4. 渲染页面
*/
function down() {
  // 1. 获取当前页
  let pageCurrent = +sessionStorage.getItem("pageCurrent");
  pageCurrent = pageCurrent + 1;
  //获取所有的学生信息
  let moviesInfo = JSON.parse(sessionStorage.getItem("moviesInfo"));
  // 2. 计算最后一页
  let lastPage = Math.ceil(moviesInfo.length / 5);
  // 当前页+1,当前页不能大于最后一页
  if (pageCurrent > lastPage) {
    pageCurrent = lastPage;
  }
  //存储当前页
  sessionStorage.setItem("pageCurrent", pageCurrent);
  // 获取当前页的数据
  moviesInfo = moviesInfo.slice((pageCurrent - 1) * 5, pageCurrent * 5);
  //渲染学生信息
  rendermoviesInfo(moviesInfo);
}

/**
 * 添加数据
 */
function addUser() {
  // 首先收集表单数据
  const img = document.querySelector("#url").value;
  const mingc = document.querySelector("#fname").value;
  const daoY = document.querySelector("#dy").value;
  const zhuY = document.querySelector("#zy").value;
  const pingF = document.querySelector("#pf").value;
  const riQ = document.querySelector("#time").value;
  const dizhi = document.querySelector("#cd").value;
  const leiX = document.querySelector("#lx").value;
  let userexp;
  for (let i = 0; i < comment.length; i++) {
    if (comment[i].checked) {
      userexp = comment[i].value;
    }
  }

  // 校验
  if (img && mingc && daoY && zhuY && pingF && riQ && dizhi && leiX) {
    Ajax({
      type: "GET",
      url: "http://localhost/project/server/movieAdd.php",
      data: { img, mingc, daoY, zhuY, pingF, riQ, dizhi, leiX },
      success() {
        location.reload();
      },
    });
  } else {
    alert("不能为空！");
  }
}

/**
 * 修改操作
 *
 * 点击模态框的确定按钮时，先获取后台数据发送ajax
 */
function updateUser() {
  const id = document.querySelector("#did").value;
  const img = document.querySelector("#url").value;
  const mingc = document.querySelector("#fname").value;
  const daoY = document.querySelector("#dy").value;
  const zhuY = document.querySelector("#zy").value;
  const pingF = document.querySelector("#pf").value;
  const riQ = document.querySelector("#time").value;
  const dizhi = document.querySelector("#cd").value;
  const leiX = document.querySelector("#lx").value;

  const userexpAll = document.querySelectorAll(".comment");
  let userexp;
  if (userexpAll[0].checked == true) {
    userexp = "好评";
  } else {
    userexp = "差评";
  }

  Ajax({
    type: "GET",
    url: "http://localhost/project/server/movieUpdatei.php",
    data: { id, img, mingc, daoY, zhuY, pingF, riQ, dizhi, leiX },
    success() {
      location.reload();
    },
  });
}

// 下拉框

function filmType() {
  const leix = document.getElementById("selectFilm").value;
  if (leix == "全部") location.reload();
  Ajax({
    url: "http://localhost/project/server/selectFilm.php",
    data: { leix },
    success(msg) {
      sessionStorage.setItem("pageCurrent", 1);
      sessionStorage.setItem("moviesInfo", msg);
      // 将数据转化为对象数组
      msg = JSON.parse(msg).slice(0, 5);
      rendermoviesInfo(msg);
    },
  });
}

//搜索
function searchFilm() {
  const filmVal = document.getElementById("filmText").value;
  if (filmVal.trim().length == 0) {
    return alert("请输入你要搜索的内容!");
  }
  Ajax({
    url: "http://localhost/project/server/movieNameSearch.php",
    data: { mname: filmVal },
    success(msg) {
      if (msg == "[]") {
        alert("未找到相关影片!");
        location.reload();
      } else {
        sessionStorage.setItem("pageCurrent", 1);
        sessionStorage.setItem("moviesInfo", msg);
        // 将数据转化为对象数组
        msg = JSON.parse(msg).slice(0, 5);
        rendermoviesInfo(msg);
      }
    },
  });
}

// 添加数据
function addData() {
  const img = document.getElementById("address").value;
  const mingc = document.getElementById("filmName").value;
  const daoY = document.getElementById("person1").value;
  const zhuY = document.getElementById("person2").value;
  const pingF = document.getElementById("advise").value;
  const riQ = document.getElementById("filmTime").value;
  const dizhi = document.getElementById("area").value;
  const leiX = document.getElementById("filmType").value;

  Ajax({
    url: "http://localhost/project/server/filmAdd.php",
    data: { img, mingc, daoY, zhuY, pingF, riQ, dizhi, leiX },
    success() {
      location.reload();
    },
  });
}

// 修改数据
function qr() {
  const id = document.querySelector("#updatesid").value;
  const url = document.getElementById("url").value;
  const fname = document.getElementById("fname").value;
  const dy = document.getElementById("dy").value;
  const zy = document.getElementById("zy").value;
  const pf = document.getElementById("pf").value;
  const time = document.getElementById("time").value;
  const cd = document.getElementById("cd").value;
  const lx = document.getElementById("lx").value;

  Ajax({
    url: "http://localhost/project/server/updateOk.php",
    data: { id, url, fname, dy, zy, pf, time, cd, lx },
    success() {
      location.reload();
    },
  });
}
